<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8" />
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
    <meta name="format-detection" content="telephone=no" />
    <title>加入我们</title>
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <link rel="shortcut icon" href="/static/favicon.ico">
    <link rel="stylesheet" href="/front/css/style.css" />
    <link rel="stylesheet" href="/front/css/slick.css">
</head>

<body>
    <!-- 头部 -->
    <div class="header">
        <div class="wp">
            <div class="logo">
                <a href=""><img src="/front/images/logo.png" alt=""></a>
            </div>
            <div>
                <div class="col-r">
                    <ul class="nav" th:include="front/header::header">

                    </ul>
                    <div class="hd-tel"><a onclick="showPhone();"></a></div>
                    <div class="soBox">
                        <span class="btn-so"></span>
                        <div class="con">
                            <form action="">
                                <input type="text" class="inp" name="articleTitle" id="articleTitle">
                                <input type="hidden" id="telephone">
                                <input onclick="search();"  type="button" value="" class="sub">
                            </form>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <!-- 头部 -->
    <div class="ban">
        <div class="slider">
            <div class="item" th:each="image,imageStat: ${advImageList}" th:style="'background-image:url('+${image.fileUrl}+')'">
                <div class="wp" th:if="${lbwsm.articleTitle} != null">
                    <div class="txt">
                        <h3 class="tit">[[${lbwsm.articleTitle}]]</h3>
                        <p th:utext="${lbwsm.articleContent}"></p>
                        <a th:href="@{'http://'+${lbwsm.articleIntroduction}}" target="_blank" class="more">了解详情</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 内容 -->
    <div class="main">
        <div class="snav">
            <div class="wp">
                <ul>
                    <li class="on"><a href="#row-f1">公司介绍</a></li>
                    <li><a href="#row-f2">人才招聘</a></li>
                    <li><a href="#row-f3">联系我们</a></li>
                    <li><a href="#row-f4">合作伙伴</a></li>
                </ul>
            </div>
        </div>
        <div class="row-f1" id="row-f1">
            <div class="wp">
                <div class="txt">
                    <h3 class="m-tit2"><span>公司简介</span><em>ABOUT US</em></h3>
                    <h4 class="tit1" th:text="${sceneryArticleDO.articleTitle}"></h4>
                    <!--<h5 class="tit2">公司优势公司优势 | 公司优势公司优势</h5>-->
                    <p th:utext="${sceneryArticleDO.articleContent}"></p>
                </div>
                <div class="pic">
                    <img th:each="image,imageStat: ${sceneryArticleDO.filePathList}" src="images/img27.jpg" th:src="${image.fileUrl}" height="400" width="600">
                </div>
            </div>
        </div>
        <div class="row-f2" id="row-f2" style="background: #f8f8f8;">
            <div class="wp">
                <h3 class="m-tit2"><span>人才招聘</span><em>JOIN US</em></h3>
                <p th:utext="${sceneryArticleDO1.articleContent}"></p>
                <div class="m-join1">
                    <div class="slider" id="diva1">

                    </div>
                </div>
                <div class="m-join2">
                    <div class="slider" id="diva2">

                    </div>
                </div>
            </div>
        </div>
        <div class="row-f3" id="row-f3">
            <div class="wp">
                <div class="col-l">
                    <h3 class="m-tit2"><span>联系我们</span><em>CONTACT US</em></h3>
                    <div class="det">
                        <i class="icon" style="background-image: url(images/img47.png);"></i>
                        <h4 class="tit1">网址</h4>
                        <p id="p2">0551-00000000</p>
                    </div>
                    <div class="det">
                        <i class="icon" style="background-image: url(images/img28.png);"></i>
                        <h4 class="tit1">电话</h4>
                        <p id="p1">400-000-0000</p>
                    </div>
                    <div class="det">
                        <i class="icon" style="background-image: url(images/img30.png);"></i>
                        <h4 class="tit1">地址</h4>
                        <p id="p3">xxxxxxxxxxxxxxxx</p>
                    </div>
                    <div class="det">
                        <i class="icon" style="background-image: url(images/img31.png);"></i>
                        <h4 class="tit1">邮箱</h4>
                        <p id="p4">xxxx@xxx.com</p>
                    </div>
                </div>
                <div class="col-r">
                    <div id="map"></div>
                </div>
            </div>
        </div>
        <div class="row-f4" id="row-f4" style="background: #f8f8f8;">
            <div class="wp">
                <h3 class="m-tit2"><span>合作伙伴</span><em>Partner</em></h3>
                <ul class="p-list8">

                </ul>
            </div>
        </div>
    </div>
    <!-- 内容 -->
    <!-- 底部 -->
    <div class="footer">
        <div class="con-top">
            <div class="wp">
                <div class="col-l">
                    <div class="f-logo">
                        <a href=""><img src="images/img1.png" alt=""></a>
                    </div>
                    <div class="f-contact">
                        <!--<p>咨询电话</p>
                        <div class="tel"><span id="span1">400-000-0000</span></div>-->
                        <p><img src="images/img4.png" alt=""><span id="span2">安徽省合肥市蜀山区XXXXXXXXX</span></p>
                        <p><img src="images/img5.png" alt="">反馈邮箱：<span id="span3">123456789@qq.com</span></p>
                    </div>
                    <div style="margin-top: 20px;">
                        <img src="images/qrcode.png" style="width: 100px;">
                        <img src="images/qrcode1.png" style="width: 100px;margin-left: 25px;">
                    </div>
                </div>
                <div th:include="front/header::footer"></div>
            </div>
        </div>
        <div class="con-bot">
            <div class="wp">
                <div class="f-copy">北京明睿长城科技有限公司 版权所有 京ICP备2021017392号-1</div>
            </div>
        </div>
    </div>
    <!-- 底部 -->
    <script src="/front/js/jquery.js"></script>
    <script src="/front/js/lib.js"></script>
    <script src="/front/js/slick.min.js"></script>
    <script src="/js/plugins/layer/layer.js"></script>
    <!-- 地图秘钥 -->
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=700b132845ef5b0b135066dfa0222a37"></script>
    <!-- 地图秘钥 end-->
    <script>
        $(document).ready(function() {
            $('.ban .slider').slick({
                dots: true,
                arrows: false,
                autoplay: true,
                slidesToShow: 1,
                fade: true,
                autoplaySpeed: 5000,
                pauseOnHover: false,
                lazyLoad: 'ondemand'
            });

            $('.m-join1 .slider').slick({
                infinite: false,
                dots: false,
                arrows: false,
                autoplay: true,
                centerMode: false,
                slidesToShow: 9,
                autoplaySpeed: 5000,
                pauseOnHover: false,
                focusOnSelect: true,
                asNavFor: '.m-join2 .slider'
            });
            $('.m-join2 .slider').slick({
                dots: false,
                arrows: true,
                autoplay: false,
                draggable: false,
                touchMove: false,
                slidesToShow: 1,
                autoplaySpeed: 5000,
                pauseOnHover: false,
                asNavFor: '.m-join1 .slider'
            });
            $('.m-join2 .slider').on('afterChange', function(event, slick, currentSlide) {
                $('.m-join1 .slider .slick-slide').eq(currentSlide).addClass('slick-current');
            });
            $('.m-join2 .slider').on('beforeChange', function(event, slick, currentSlide, nextSlide) {
                $('.m-join1 .slider .slick-slide').siblings('.slick-slide').removeClass('slick-current');
            });

        });
    </script>
    <script type="text/javascript">
        // 百度地图API功能
        var map = new BMap.Map("map");
        var point = new BMap.Point(116.460523,39.811391);
        map.centerAndZoom(point, 17);
        var marker = new BMap.Marker(point); // 创建标注
        map.addOverlay(marker); // 将标注添加到地图中
        map.enableScrollWheelZoom(); //启用滚轮放大缩小，默认禁用

        getListWork();
        getListCompany();

        function getListWork(){
            $.ajax({
                type : "POST",
                url :  "/front/listWork",
                data : {offset:0,limit:10},
                async : false,
                success : function(data) {
                    if(data != null && data != '') {
                        var html1 = "";
                        var html2 = "";
                        for (var i=0;i<data.length;i++){
                            html1 += '<div class="item">';
                            html1 += '<div class="det">'+data[i].workName+'</div>';
                            html1 += '</div>';
                            html2 += '<div class="item">';
                            html2 += '<div class="txt1">';
                            html2 += '<h3 class="tit1">'+data[i].workName+'</h3>';
                            html2 += '<div class="con">';
                            html2 += '<span>工作地点：'+data[i].workAddress+'</span>';
                            html2 += '<span>工作类别：'+data[i].workType+'</span>';
                            html2 += '<span>发布时间：'+data[i].createDate+'</span>';
                            html2 += '</div>';
                            html2 += '</div>';
                            html2 += '<h4 class="tit2">职位描述：'+data[i].workDescription+'</h4>';
                            html2 += '<p></p>';
                            html2 += '</div>';
                        }
                        $("#diva1").html(html1);
                        $("#diva2").html(html2);
                    }
                }
            });
        }

        function getListCompany(){
            $.ajax({
                type : "POST",
                url :  "/front/listCompany",
                data : {offset:0,limit:10},
                async : false,
                success : function(data) {
                    if(data != null && data != '') {
                        var html1 = "";
                        for (var i=0;i<data.length;i++){
                            var filePathList = data[i].filePathList;
                            var fileImage = "";
                            if(null != filePathList && filePathList.length > 0) {
                                fileImage = filePathList[0].fileUrl;
                            }
                            html1 += '<li>';
                            html1 += '<a class="pic">';
                            html1 += '<img src="'+fileImage+'">';
                            html1 += '</a>';
                            html1 += '</li>';
                        }
                        $(".p-list8").html(html1);
                    }
                }
            });
        }

        function showPhone() {
            var telephone = $("#telephone").val();
            layer.msg(telephone)
        }

        function search() {
            var articleTitle = $("#articleTitle").val();
            if(articleTitle == null || articleTitle == '') {
                layer.msg("请输入查询关键字");
                return false;
            }
            window.location.href = "/front/news?articleTitle="+articleTitle;
        }

    </script>
</body>

</html>